<template>
  <div class="header_body">
    <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
    >
      <el-menu-item index="1"
        ><RouterLink to="/login">首页</RouterLink></el-menu-item
      >
      <RouterLink to="/login"
        ><el-menu-item index="1"
          >关于我们<RouterLink to="/ours"></RouterLink></el-menu-item
      ></RouterLink>

      <el-menu-item index="1"
        >个人信息<RouterLink to="users"></RouterLink>
      </el-menu-item>
    </el-menu>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const activeIndex = ref('1');
const activeIndex2 = ref('1');
const handleSelect = (key: string, keyPath: string[]) => {
  console.log(key, keyPath);
};
</script>
<style>
.header_body {
  flex-direction: column-reverse;
}
</style>
